<template>
  <div>
    <!-- :limit="5" -->
    <!-- :http-request="httpRequest" -->

    <el-upload
      class="upload-demo"
      action=""
      :on-preview="handlePreview"
      :on-remove="handleRemove"
      :before-remove="beforeRemove"
      multiple
      :auto-upload="false"
      :on-change="handleChange"
      :before-upload="beforeUpload"
      :on-exceed="handleExceed"
      :file-list="fileList"
    >
      <el-button size="small" type="primary">选择文件</el-button>
    </el-upload>
    <!-- <el-button size="small" type="primary" @click="upload">上传</el-button> -->
  </div>
</template>

<script>
import { uplodeImg } from '@/api/sceneProduct' //api接口
import axios from '@/utils/axios'
export default {
  data() {
    return {
      fileList: []

    }
  },
  methods: {
    // httpRequest(item) {
    //   console.log(item)
    //   let formData = new FormData()
    //   formData.append('files', item.file)
    //   axios({
    //     method: 'POST',
    //     url: '/digital-admin/sysfile/filesupload',
    //     headers: {
    //       'Content-Type': 'multipart/form-data'
    //     },
    //     data: formData,
    //   })
    //   uplodeImg(formData).then((res) => {
    //   })
    // },
    handleChange(file, fileList) {
      this.fileList = fileList
      const formData = new FormData()
      // fileList.forEach(item => {
      //   formData.append('files', item.raw)
      // })
      formData.append('files', file.raw)
      uplodeImg(formData).then((res) => {
        if (res.code === 0) {

          // this.$message({
          //   message: '新增成功',
          //   type: 'success'
          // })
        }
      })
    },
    beforeUpload() {},
    handleRemove(file, fileList) {
      console.log(file, fileList)
    },
    handlePreview(file) {
      console.log(file)
    },
    handleExceed(files, fileList) {
      // this.$message.warning(
      //   `当前限制选择 5 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
      //     files.length + fileList.length
      //   } 个文件`
      // )
    },
    beforeRemove(file, fileList) {
      // return this.$confirm(`确定移除 ${file.name}？`)
    }
  }
}
</script>
